<template>
	<div class="header">
    <div class="page-title">收货公司</div>
		<el-button type="text" @click="dialogVisible = true,handleAdd()">添加</el-button>
		<el-table :data="tableData" border style="width: 100%">
			<el-table-column prop="receive_company_name" label="公司名称" width="200"></el-table-column>
			<el-table-column prop="date_time" label="日期" width="160"></el-table-column>
			<el-table-column label="操作" width="100">
        <template #default="v">
          <el-button @click="handleEdit(v.row)" type="text" size="small">编辑</el-button>
          <el-button type="text" size="small" @click="handleDelete(v.row)">删除</el-button>
        </template>
			</el-table-column>
		</el-table>
    <el-pagination
        background
        hide-on-single-page
        layout="prev,page,next"
        :total="total"
        :current-page="current"
        @current-change="changePage"></el-pagination>
    <el-dialog title="收货公司" v-model="dialogFormadd" width="50%">
      <el-form>
        <el-form-item label="公司名称">
          <el-input v-model="form.receive_company_name"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="onSubmit">立即创建</el-button>
          <el-button @click="handleClose">取消</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
	</div>
</template>

<script>
import {request_receive_index,request_receive_delete,request_receive_add,request_receive_edit} from "@/network/api";
	export default {
    data() {
      return {
        dialogVisible: false,
        tableData: [],
        dialogFormadd:false,
        actionType:0, //1 添加 2编辑
        current:1,
        total:0,
        form:{
          receive_company_name:''
        },
      }
    },
    mounted() {
      this.init()
    },
    methods: {
      init(){
        this.$nextTick(()=>{
          request_receive_index().then((res)=>{
            let result = res.data;
            if(result.code==200){
              this.tableData = result.data.data;
              this.total = result.data.total;
              this.current = result.data.current;
            }
          }).catch()
        })
      },
      //分页
      changePage(page){
        request_receive_index(page).then((res)=>{
          let result = res.data;
          if(result.code==200){
            this.tableData = result.data.data;
            this.total = result.total;
            this.current = result.current;
          }
        }).catch()
      },
      handleEdit(row){
        this.actionType = 2
        this.dialogFormadd = true
        this.form = row
      },
			handleDelete(row) {
				this.$confirm('此操作将永久删除，是否继续?','系统提示',{
          type:'warning',
          confirmButtonText: '确定',
          cancelButtonText: '取消',
        }).then(()=>{
          request_receive_delete({
            id:row.id
          }).then((res)=>{
            let result = res.data;
            if(result.code==200){
              this.$message.success({
                message:'删除成功',
                offset:70
              })
              this.changePage(this.page)
            }else {
              this.$message.error({
                message:result.message,
                offset:70
              });
            }

          }).catch()
        }).catch(()=>{
          this.$message.info({
            message:'已取消删除!',
            offset:70
          });
        });
			},
      onSubmit(){
        if(this.form.receive_company_name==''){
          this.$message({
            message:'公司名称不允许为空!',
            type:'warnging',
          })
          return false;
        }
        let apiFunc;
        switch (this.actionType){
          case 1:   //添加
                apiFunc = request_receive_add;
                break;
          case 2:   //编辑
                apiFunc = request_receive_edit;
                break;
          default:
              this.message.error({
                message:'操作类型不正确',
                offset:70
              })
                return false;
        }
        apiFunc({
          ...this.form
        }).then((res)=>{
          let result = res.data;
          if(result.code==200){
            this.dialogFormadd = false
            this.$message.success({
              message:result.message,
              offset:70
            })
            location.reload()
          }else{
            this.$message.error({
              message:result.message,
              offset:70
            })
          }
        }).catch()
      },
			handleClose() {
        this.dialogFormadd = false
			},
      handleAdd(){
        this.dialogFormadd = true
        this.actionType = 1
			}
		},


	}
</script>

<style>
</style>
